<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
	<title>Programi</title>
     <link rel="stylesheet" href="css/style.css" type="text/css">
     <meta name="viewport" content="width=device-width" />
</head>

<body>
	<header>
		<h1 class="title">Programi</h1>
	</header>
	<main>
		<p>OpenBoard pruža nekoliko programa i alata. Možeš im pristupiti pritiskom na <span class="icon"><img src="../../assets/common/ApplicationsCategory.png" alt=""></span> u OpenBoard biblioteci</p>
		<h3>Standardni programi</h3>
		<p>Pronaći ćeš geometrijske alate, kalkulator, Google kartu, generator QR koda i još više! Kombiniraj ih za stvaranje poticajnih nastava!</p>
		<div class="image"><img src="../../assets/hint10/application-gif1.gif" alt=""></div>
		<h3>Stvaranje programa</h3>
		<p>Kao što je objašnjeno u odjeljku Web modusa, programi s web stranica se mogu izraditi koristeći interni navigator ili kopiranjem i umetanjem URL adresa na ploču.</p>
		<p>Na ovaj način možeš podržati svoju nastavu moćnim online alatima izravno na ploči! Primjeri zanimljivih programa koje se mogu stvoriti (povuci i ispusti ih na ploču za testiranje!): </p>
		<ul>
			<li><a class="non-clickable" href="https://scratch.mit.edu/">Scratch</a></li>
			<li><a class="non-clickable" href="https://phet.colorado.edu">PhET simulacije</a></li>
			<li><a class="non-clickable" href="https://earth.google.com/web">Google Earth</a></li>
			<li><a class="non-clickable" href="https://flockmod.com">Flockmod</a></li>
			<li><a class="non-clickable" href="https://www.duolingo.com/">Duolingo</a></li>
		</ul>
		
		<p>… i još puno više!</p>
		
		<span class="tip"><span class="icon"><img src="../../assets/common/tip.png" alt=""></span>Trebaš moćniji kalkulator od onog koji nudi OpenBoard? Misli na to da možeš stvoriti vlastite programe! Jednostavno povuci i ispusti sljedeću poveznicu na ploču: <a class="non-clickable" href="https://ti89-simulator.com/">https://ti89-simulator.com/</a></span>
	</main>
	<footer>

	</footer>
	<script>
		document.querySelectorAll('.non-clickable').forEach(e => e.addEventListener('click', e => {
			e.stopPropagation();
			e.preventDefault();
		}));
	</script>
</body>
</html>
